<template>
  <div>
    <zh-form  ref="formInfo" :colmun="1" :rules="rules" :model="formInfo"  labelAlign="right" >

      <zh-card style="width:100%">

        <zh-row>
          <zh-input prop="taskArea" type="tree" mode="multiple" label="执行区域"  placeholder="支持多选"
                    allowClear
                    tree-checkable
                    multiple
                    v-model="formInfo.taskArea"
                    :treeData="taskAreaTree"
                    :showCheckedStrategy = "SHOW_PARENT"
                    :span="22"
                    style="float: left"
                    :labelCol="{span:3}" :wrapperCol="{span:16}"
                    @change="taskAreaChange"
          >
          </zh-input>
        </zh-row>
        <zh-row>
          <zh-input prop="g0204" type="tree" mode="multiple" label="文物等级"  placeholder="支持多选"
                    allowClear
                    tree-checkable
                    multiple
                    v-model="formInfo.g0204"
                    :treeData="treeData.b0105"
                    :showCheckedStrategy = "SHOW_PARENT"
                    :span="22"
                    style="float: left"
                    :labelCol="{span:3}" :wrapperCol="{span:16}"
                    :replaceFields="{children:'children', title:'title', key:'key', value: 'value' }"
                    @change="g0204Change"
                    :disabled="g0204Disabled"
          >
          </zh-input>
        </zh-row>

        <zh-row>
          <zh-input prop="g0205" type="tree" mode="multiple" label="巡查级别"  placeholder="支持多选"
                    allowClear
                    tree-checkable
                    multiple
                    v-model="formInfo.g0205"
                    :treeData="treeData.b0129"
                    :showCheckedStrategy = "SHOW_PARENT"
                    :span="22"
                    style="float: left"
                    :labelCol="{span:3}" :wrapperCol="{span:16}"
                    :replaceFields="{children:'children', title:'title', key:'key', value: 'value' }"
                    @change="g0205Change"
                    :disabled="g0205Disabled"
          >
          </zh-input>
        </zh-row>

        <zh-row>
          <zh-input prop="g0206" type="tree" mode="multiple" label="类别"  placeholder="支持多选"
                    allowClear
                    tree-checkable
                    multiple
                    v-model="formInfo.g0206"
                    :treeData="treeData.b0104"
                    :showCheckedStrategy = "SHOW_PARENT"
                    :span="22"
                    @change="g0206Change"
                    style="float: left"
                    :labelCol="{span:3}" :wrapperCol="{span:16}"
                    :replaceFields="{children:'children', title:'title', key:'key', value: 'value' }"
          >
          </zh-input>
        </zh-row>

        <zh-row>
          <a-col :span="22">
            <a-form-model-item label="抽检比例" prop="g0208" :labelCol="{span:3}" :wrapperCol="{span:21}">
              <div style="display: inline-block;margin-left: 5px">
                <a-input-number id="g0208" v-model="formInfo.g0208" @change="g0208Change" :min=g0208Min :max=g0208Max />
                <label style="color: black;margin-bottom: 2px"> % </label>
              </div>
              <div style="display: inline-block; margin-bottom: 20px;margin-left: 5px">
                <label style="color: black;">随机抽检数量： </label>
                <a-input-number id="g0209" v-model="formInfo.g0209" @change="g0209Change" :min=g0209Min />
                <label style="color: black;"> 处 </label>
              </div>
              <div style="display: inline-block; margin-bottom: 20px;margin-left: 5px">
                <label style="color: black;">随机督察人数： </label>
                <a-input-number id="g0210" v-model="formInfo.g0210" :min=g0210Min />
                <label style="color: black;"> 人 </label>
              </div>
            </a-form-model-item>
          </a-col>
        </zh-row>

      </zh-card>

    </zh-form>
  </div>
</template>

<script>
import modal from 'ant-design-vue/es/modal'
import {getBatchDict} from "@/services/system/api"
import {getInspectSettingRes, getPermissionParams,getDictByC0303Area,getAllInspectPointCount} from '@/services/system/whdngxlApi'
import {TreeSelect} from "ant-design-vue";
import moment from "moment";
import {mapGetters} from "vuex";

const SHOW_PARENT = TreeSelect.SHOW_PARENT;
export default {
  components:{
  },
  computed: {
    ...mapGetters(['size']),
  },
  props:{
    setInspectData:{
      type:Function,
      default:null
    },
    setInspectDataTwo:{
      type:Function,
      default:null
    }
  },
  data() {
    return {
      formInfo:{
        g0201:'',
        g0202:'',
        c0303:'',
        g0503:'',
        g0504:null,
        taskArea:undefined,
        g0204:undefined,
        g0205:undefined,
        g0206:undefined,
        g0207:'',
        g0208:'',
        g0209:'',
        g0210:'',
        beforeChooseCount:null,//记录编辑前的点位数量
        inspectPointList:[],
        // alreadyInspectPoint:[],
      },
      rules:{},
      dictData: {
        b0105:[],
        b0104:[],
        b0129:[],
      },
      treeData: {
        b0105:[],
        b0104:[],
        b0129:[],},
      taskAreaTree:[],
      SHOW_PARENT,
      visible: false,
      g0204Disabled:false,
      g0205Disabled:false,
      pointFlag:false,//是否从巡查清单页面打开
      labelCol: { span: 2 },
      wrapperCol: { span: 22 },
      g0208Min:1,
      g0208Max:100,
      g0209Min:1,
      g0210Min:1,
      allPointCount:null, //根据所选项查询出的所有点位数据量
      editIndex:null,//编辑时传入的数组下标
    }
  },

  created() {

    //获取任务范围
    this.$http.post(getPermissionParams, {}).then(res => {
      const data = res.result
      this.taskAreaTree = data.orgTreeData
    })
  },
  methods: {
    initData(data,pointFlag){
      this.formInfo.c0303 = data.c0303
      this.formInfo.g0503 = data.g0503
      this.formInfo.g0504 = data.g0504
      // this.formInfo.alreadyInspectPoint = data.alreadyInspectPoint
      this.pointFlag = pointFlag //该标记表示是从任务清单页面跳转而来

      //编辑
      if(data.g0202){
        // this.formInfo = data
        if(data.g0201){
          this.formInfo.g0201 = data.g0201
        }
        this.formInfo.taskArea = data.taskArea
        if(data.g0204){
          this.formInfo.g0204 = data.g0204
        }
        if(data.g0205){
          this.formInfo.g0205 = data.g0205
        }
        this.formInfo.g0206 = data.g0206
        this.formInfo.g0208 = data.g0208
        this.formInfo.g0209 = data.g0209
        this.formInfo.g0210 = data.g0210
        if(data.g0207){
          this.formInfo.g0207 = data.g0207
        }
        if(data.editIndex!=null){
          this.editIndex = data.editIndex
        }
        // this.formInfo.beforeChooseCount = data.pointCount
        //编辑时初始化
        this.g0204G0205Check()
        this.getTreeData()
      }
    },

    getTreeData(){
      if(this.formInfo.taskArea!==undefined && this.formInfo.taskArea.length>0){
        const param = Object.assign(this.formInfo)
        this.$http.post(getDictByC0303Area, param).then(res => {
          this.dictData = res.result
          //添加下拉数数据
          let keyArr = Object.keys(this.dictData);
          for (let i = 0; i < keyArr.length; i++) {
            let treeKey = keyArr[i];
            let treeParam = this.dictData[treeKey];
            if(treeParam.length>0){
              let title = ''
              switch (treeKey){
                case 'b0105' : title = "全部文物等级"
                  break
                case 'b0104' : title = "全部古系列类别"
                  break
                case 'b0129' : title = "全部巡查级别"
                  break
              }
              let treeObj = {title:title,value:'00',key:'00'};
              let children = []
              for (let j = 0; j < treeParam.length; j++) {
                let treeArr = {
                  key: treeParam[j].dictKey,
                  value: treeParam[j].dictKey,
                  title:treeParam[j].dictValue,
                };
                children.push(treeArr);
              }
              treeObj.children = children
              this.treeData[treeKey].push(treeObj)
            }
          }
        })
      }
    },
    d0902Change(){
      this.$forceUpdate(); //重新强制渲染
    },
    d0903Change(){
      this.$forceUpdate(); //重新强制渲染
    },
    //日期选择器禁用的日期
    onDisabledDate(current){
      const time = moment().endOf('day').subtract(1, 'days')
      return current < time
    },
    confirm(){
      if(this.formInfo.taskArea == undefined){
        modal.warn({title: '提示', content: '执行区域不能为空'})
        return
      }
      if(this.formInfo.g0204 == undefined && this.formInfo.g0205 == undefined){
        modal.warn({title: '提示', content: '文保级别和巡查级别不可都为空'})
        return
      }
      if(this.formInfo.g0206 == undefined){
        modal.warn({title: '提示', content: '类别不能为空'})
        return
      }
      if(this.formInfo.g0208 == null || this.formInfo.g0208 == ''){
        modal.warn({title: '提示', content: '抽检比例不能为空'})
        return
      }
      if(this.formInfo.g0209 == null || this.formInfo.g0209 == ''){
        modal.warn({title: '提示', content: '抽检数量不能为空'})
        return
      }
      if(this.formInfo.g0210 == null || this.formInfo.g0210 == ''){
        modal.warn({title: '提示', content: '抽查人数不能为空'})
        return
      }
      const params = Object.assign(this.formInfo)
     /* if(this.editIndex!=null){
        this.formInfo.alreadyInspectPoint.splice(this.editIndex, 1);
      }*/
      setTimeout(() => {
        this.$http.post(getInspectSettingRes, params).then((res) => {
          this.formInfo.g0202 = res.result.g0202
          this.formInfo.g0204Name = res.result.g0204Name
          this.formInfo.g0205Name = res.result.g0205Name
          this.formInfo.g0206Name = res.result.g0206Name
          this.formInfo.pointCount = res.result.pointCount
          this.formInfo.inspectPointList = res.result.inspectPointList
          if(this.pointFlag){
            this.$emit("handleCancelTwo")
            if(this.setInspectDataTwo){
              this.setInspectDataTwo(this.formInfo)
            }
          }else{
            this.$emit("handleCancel")
            if(this.setInspectData){
              this.setInspectData(this.formInfo)
            }
          }
        }).catch((error) => {
          console.log(JSON.stringify(error))
        }).finally(() =>{
        })
      }, 50)
    },
    handleCancel() {
      this.visible = false;
    },
    showOrHide() {
      this.visible = !this.visible;
    },
    handleOk() {
    },
    g0204Change(){
      this.g0205Disabled = this.formInfo.g0204 && this.formInfo.g0204.length > 0;
      this.formInfo.g0208 = null
      this.formInfo.g0209 = null
      this.formInfo.g0210 = null
    },
    g0205Change(){
      this.g0204Disabled = this.formInfo.g0205 && this.formInfo.g0205.length>0;
      this.formInfo.g0208 = null
      this.formInfo.g0209 = null
      this.formInfo.g0210 = null
    },
    g0206Change(){
      this.formInfo.g0208 = null
      this.formInfo.g0209 = null
      this.formInfo.g0210 = null
    },
    g0204G0205Check(){
      this.g0205Disabled = this.formInfo.g0204 && this.formInfo.g0204.length > 0;
      this.g0204Disabled = this.formInfo.g0205 && this.formInfo.g0205.length>0;
    },
    taskAreaChange(){
      this.treeData = {  b0105:[],
        b0104:[],
        b0129:[],}
      this.dictData = {  b0105:[],
        b0104:[],
        b0129:[],}
      this.formInfo.g0204 = undefined
      this.formInfo.g0205 = undefined
      this.formInfo.g0206 = undefined
      this.formInfo.g0208 = null
      this.formInfo.g0209 = null
      this.formInfo.g0210 = null
      this.g0204Change()
      this.g0205Change()
      this.getTreeData()
    },
    g0208Change(){
      if(this.formInfo.g0208 != null && this.formInfo.g0208 != '' ){
        const params = Object.assign(this.formInfo)
        setTimeout(() => {
          this.$http.post(getAllInspectPointCount, params).then((res) => {
            this.allPointCount = res.result
            this.formInfo.g0209 = Math.ceil(this.allPointCount*(this.formInfo.g0208/100))
          }).catch((error) => {
          }).finally(() =>{
          })
        }, 50)
      }else{
        this.formInfo.g0209 = null
      }
    },
    g0209Change(){
      if(this.formInfo.g0209 != null && this.formInfo.g0209 != '' ){
        const params = Object.assign(this.formInfo)
        setTimeout(() => {
          this.$http.post(getAllInspectPointCount, params).then((res) => {
            this.allPointCount = res.result
            this.formInfo.g0208 = Math.ceil(this.formInfo.g0209/this.allPointCount*100)
          }).catch((error) => {
          }).finally(() =>{
          })
        }, 50)
      }else{
        this.formInfo.g0208 = null
      }
    },
  },
}
</script>

<style scoped lang="less">
.list-item {
  display: flex;

  .list-item-index {
    width: 36px;
    font-size: 18px;
  }
}

.sub-form {
  margin-top: 15px;
}
</style>
